<extend file='resource/view/mobile'/>
<block name="title">地址管理 - HDCMS开源免费三网系统</block>
<block name="content">
    <nav class="navbar navbar-default navbar-fixed-top">
        <div class="container">
            <div class="navbar-header">
                <a class="navbar-brand" href="javascript:history.go(-1);" style="position: absolute;">
                    <i class="fa fa-chevron-left"></i>
                </a>
                <p class="navbar-text navbar-right text-center">
                    <if value="empty($field)">
                        新建地址
                        <else/>
                        修改地址
                    </if>
                </p>
            </div>
        </div>
    </nav>
    <div style="height:60px;"></div>
    <div class="panel panel-default">
        <div class="panel-body address">
            <form action="" method="post" class="form-horizontal">
                <input type="hidden" name="id" value="{{q('get.id')}}">
                <div class="form-group">
                    <label class="col-sm-2 control-label">姓名</label>
                    <div class="col-sm-10">
                        <input type="text" name="username" value="{{$field['username']}}" class="form-control input-sm">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">电话</label>
                    <div class="col-sm-10">
                        <input type="tel" name="mobile" value="{{$field['mobile']}}" class="form-control input-sm">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">邮编</label>
                    <div class="col-sm-10">
                        <input type="tel" name="zipcode" value="{{$field['zipcode']}}" class="form-control input-sm">
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">收货地址</label>
                    <div class="col-sm-10 row">
                        <div class="col-xs-12 col-sm-4 col-md-4 col-lg-4 t-select">
                            <select name="province" class="form-control"></select>
                        </div>
                        <div class="col-xs-12 col-sm-4 col-md-4 col-lg-4 t-select">
                            <select name="city" class="form-control"></select>
                        </div>
                        <div class="col-xs-12 col-sm-4 col-md-4 col-lg-4 t-select">
                            <select name="district" class="form-control"></select>
                        </div>
                    </div>
                </div>
                <div class="form-group">
                    <label class="col-sm-2 control-label">详细地址</label>
                    <div class="col-sm-10">
                        <input type="text" name="address" value="{{$field['address']}}" class="form-control input-sm">
                    </div>
                </div>
                <button class="btn btn-success btn-block btn-lg"> 保存地址</button>
            </form>
        </div>
    </div>
    <div class="text-center">
        <a href="http://www.hdcms.com" class="text-muted">HDCMS 免费建站系统</a>
    </div>
    <style>
        .panel {
            border : none;
        }

        .address .form-group {
            margin-bottom : 5px;
        }

        .t-select {
            margin-bottom : 10px;
        }
    </style>
</block>
<script>
    require(['util','address'], function (util,address) {
        address.render({
            //省份标签
            province: document.querySelector('[name="province"]'),
            //城市标签
            city: document.querySelector('[name="city"]'),
            //地区标签
            area: document.querySelector('[name="district"]'),
        }, {
            province: "{{$field['province']}}",
            city: "{{$field['city']}}",
            area: "{{$field['district']}}",
        });
        //表单提交
        $("form").submit(function () {
            var username = $.trim($("[name='username']").val());
            var mobile = $.trim($("[name='mobile']").val());
            var province = $.trim($("[name='province']").val());
            var city = $.trim($("[name='city']").val());
            var district = $.trim($("[name='district']").val());
            var address = $.trim($("[name='address']").val());
            var msg = '';
            if (username == '') {
                msg += "姓名不能为空<br/>";
            }
            if (mobile == '') {
                msg += "电话不能为空<br/>";
            }
            if (province == '') {
                msg += "省份不能为空<br/>";
            }
            if (city == '') {
                msg += "城市不能为空<br/>";
            }
            if (address == '') {
                msg += "详细地址不能为空<br/>";
            }
            if (msg) {
                util.message(msg, '', 'error', {width: ''});
                return false;
            }
        });
    });
</script>